<template>
    <div class="home-recommend">
        <div v-for="item in recommends" :key="item.acm">
            <a :href="item.link">
                <img :src="item.image" alt="">
                <div class="title">{{item.title}}</div>
            </a>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {

        };
    },
    props:{
       recommends:{
          type:Array,
          default(){
              return []
          }
       }
    },
    created() {

    },
    mounted() {

    },
    methods: {

    }
};
</script>

<style scoped lang="scss">
 .home-recommend{
     display: flex;
     width:100%;
     border-bottom: 10px solid #eee;
     &>div{
         flex: 1;
         text-align: center;
         padding: 10px;
         img{
            width: 100%;
         }
         .title{
             color: #666;
             font-size: 12px;
             margin: 10px 0;
         }
     }
 }
</style>
